<template>
  <div>
    <h1>数据修改</h1>
    <ul>
      <li v-for="(item,index) in arr" :key="index">{{item.name}}</li>
    </ul>
    <button @click="del">删除第二个</button>
    <button @click="protoEventBus">触发原型对象上的eventBus</button>
  </div>
</template>

<script>
import eventBus from "../utils/eventBus.js";
export default {
  name: "",
  props: ["arr"],
  data() {
    return {
      num: 0
    };
  },

  components: {},

  computed: {},

  beforeMount() {},

  mounted() {
    eventBus.$on("giveMsg", msg => {
      console.log(msg);
    });
  },

  methods: {
    del() {
      // 数据在哪完成数据的增删改在哪里
      this.$emit("delItem", 1);
    },
    protoEventBus() {
      this.$eventBus.$emit("testProto", this.num);
    }
  },

  watch: {}
};
</script>
<style lang='' scoped>
</style>